import { Button, DatePicker, Form } from 'antd';

import React from 'react';
import { useLocation, useNavigate } from 'react-router-dom';

import queryString from 'query-string';
import PropsType from '../model/ReactSys';
import http from '../common/http';


class NormalLoginForm extends React.Component<PropsType> {

    // constructor(props: PropsType) {  // 这种写法也可以
    constructor(props: any) {
        super(props)
        this.state = {
            loading: false,
            reviewList: []
        }
    }

    componentDidMount() {
        var search = this.props.location.search
        let data = queryString.parse(search)
        console.info(data)
    }

    onClick = () => {
        console.info("-------------------")
        http.post("/api/test1", { key1: "v1", key2: 33 })
        http.get("/api/test1?test=abc&k=233")
    }

    render() {
        return (
            <div>
                <Button onClick={this.onClick} type="primary"> 测试 </Button>
                <DatePicker
                    placeholder="选择日期"
                />
            </div>
        )
    }
}

// export default NormalLoginForm   // 直接这样 export 获取不到路由参数
function WithNavigate(props: any) {
    let navigate = useNavigate();   // 用作组件返回时才有用
    let location = useLocation();
    let [form] = Form.useForm();
    return <NormalLoginForm {...props} navigate={navigate} location={location} form={form} />
}
export default WithNavigate         // 封装下 export 才能获取路由参数